<template>
  <div>
    <el-dialog v-dialogDrag :visible="dialogFormVisible" width="80%" top="15vh" :title="title" @close="close">
      <TableComp refTableCompElemultipleTable" :tableData="allData" :tableConfig="tableConfig" :tableBaseConfig="{ maxHeight: '470px' }"
        :isSelect="false" :isIndex="false" :isShowPage="false"></TableComp>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="close">关闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
export default {
  data() {
    return {
      dialogFormVisible: true,
      tableConfig: [
        {
          label: "进展名称",
          prop: "projectName",
          width: "300px",
          isLink: true,
          type: "primary",
          align: "left",
          showTooltip: () => {
            return false;
          },
          method: (row) => {
            this.$router.push({
              name: this.detailPath,
              query: { projectId: row.projectId, isEdit: true },
            });
          },
        },
        {
          label: "承担单位",
          prop: "undertakeUnit",
        },
        {
          label: "主管机关",
          prop: "competentAuthority",
        },
        {
          label: "推荐单位/专家组织",
          prop: "recommendUnitExpert",
        },
        {
          label: "填写信息",
          prop: "statusValue1",
          width: "140px",
          popOver: (row) => {
            let iconClass = "";
            let name = "";
            if (
              row.projectName &&
              row.projectChannel &&
              row.undertakeUnit &&
              row.competentAuthority &&
              row.contactPerson &&
              row.contactInformation &&
              row.projectProfile &&
              row.recommendation &&
              row.recommendUnitExpert &&
              row.undertakeUnitType &&
              row.recommendPerson &&
              row.recommendTime &&
              row.specialDirectionType
            ) {
              iconClass = "success";
              name = "完整";
            } else {
              iconClass = "noSuccess";
              name = "缺失";
            }
            let _errorList = [];
            if (!row.projectName) {
              _errorList.push("进展名称未填写");
            }
            if (!row.projectChannel) {
              _errorList.push("项目渠道未填写");
            }
            if (!row.undertakeUnit) {
              _errorList.push("承研单位未填写");
            }
            if (!row.undertakeUnitType) {
              _errorList.push("所属单位类型未填写");
            }
            if (!row.competentAuthority) {
              _errorList.push("主管机关未填写");
            }
            if (!row.contactPerson) {
              _errorList.push("联系人未填写");
            }
            if (!row.contactInformation) {
              _errorList.push("联系方式未填写");
            }
            if (!row.projectProfile) {
              _errorList.push("进展简介未填写");
            }
            if (!row.recommendation) {
              _errorList.push("推荐意见未填写");
            }
            if (!row.recommendUnitExpert) {
              _errorList.push("推荐单位/专家组织名称未填写");
            }
            if (!row.recommendPerson) {
              _errorList.push("推荐人未填写");
            }
            if (!row.recommendTime) {
              _errorList.push("推荐时间未填写");
            }
            if (!row.specialDirectionType) {
              _errorList.push("所属专家组织未填写");
            }
            return {
              name,
              isPop: name == "缺失",
              content: _errorList,
              iconClass,
              title: "缺失材料如下:",
            };
          },
        },
      ],
    };
  },
  props: {
    allData: {
      type: Array,
      default: () => [],
    },
    detailPath: {
      type: String,
      default: "",
    },
    title: {
      type: String,
      default: "以下进展信息填写不完整",
    },
  },
  created() { },
  methods: {
    close() {
      this.$emit("closeDialog");
    },
  },
};
</script>
<style lang="less" scoped>
  .dataFormStyle {
    padding: 0px 71px;
  }
  .width100Style {
    width: 100%;
  }
  .titleStyle {
    border-bottom: 0.0625rem solid #eee;
    padding-bottom: 1.0625rem;
  }
  .buttonStyle {
    margin-left: 6.25rem;
  }
  .warning {
    color: @warning;
  }
</style>
